import React from 'react';
import { Form, Input, Modal } from 'antd';
import moment from 'moment';

const formItemLayout = {
  labelCol: {
    span: 6,
  },
  wrapperCol: {
    span: 14,
  },
};

const modal = ({
  item = {},
  onOk,
  form: {
    getFieldDecorator,
    validateFields,
    getFieldsValue,
  },
  modalType,
  ...modalProps
}) => {
  const handleOk = () => {
    validateFields((errors) => {
      if (errors) {
        return;
      }
      onOk(getFieldsValue());
    });
  };

  const modalOpts = {
    ...modalProps,
    onOk: handleOk,
    title: modalType ? '修改Region' : '新建Region',
    okText: modalType ? '修改' : '创建',
  };

  const formItems = [];
  formItems.push(
    <Form.Item label="名字" hasFeedback {...formItemLayout}>
      {getFieldDecorator('name', {
      initialValue: item.name,
      rules: [
        {
          required: true,
        },
      ],
    })(<Input />)}
    </Form.Item>);
  formItems.push(
    <Form.Item label="描述" hasFeedback {...formItemLayout}>
      {getFieldDecorator('description', {
      initialValue: item.description,
      rules: [
        {
          required: true,
        },
      ],
    })(<Input type="textarea" />)}
    </Form.Item>);
  formItems.push(
    <Form.Item label="vRegion" hasFeedback {...formItemLayout}>
      {getFieldDecorator('vRegionID', {
        initialValue: item.vRegionID,
        rules: [
          {
            required: true,
          },
        ],
      })(<Input />)}
    </Form.Item>);

  if (modalType) {
    formItems.push(
      <Form.Item label="UUID" {...formItemLayout}>
        {getFieldDecorator('id', {
        initialValue: item.id,
      })(<Input disabled />)}
      </Form.Item>);
    formItems.push(
      <Form.Item label="创建时间" {...formItemLayout}>
        {getFieldDecorator('createTime', {
        initialValue: moment(item.createTime).format('YYYY-MM-DD HH:mm:ss'),
      })(<Input disabled />)}
      </Form.Item>);
    formItems.push(
      <Form.Item label="上次修改时间" {...formItemLayout}>
        {getFieldDecorator('updateTime', {
        initialValue: moment(item.updateTime).format('YYYY-MM-DD HH:mm:ss'),
      })(<Input disabled />)}
      </Form.Item>);
  }

  return (
    <Modal

      {...modalOpts}
    >
      <Form layout="horizontal">
        {formItems}
      </Form>
    </Modal>
  );
};

export default Form.create()(modal);
